<template>

  <div class="login-form">
    <div class="login-container">
    <div class="login_warp">
      <div class="loginbox fl">
        <div class="login_header">
          <span @click="cur=0" :class="{active:cur===0}">账号登录</span>
          <span @click="cur=1" :class="{active:cur===1}">快速注册</span>
          <span @click="cur=2" :class="{active:cur===2}">第三方登陆</span>
        </div>
        <div class="login_content">
          <div v-show="cur===0" class="Cbody_item">
            <div class="form_item"><input type="text" name="fname" placeholder="用户名" value="admin"></div>
            <div class="form_item"><input type="password" name="fpassword" placeholder="密码"></div>
            <div class="form_item">
              <div class="fl"><input  type="checkbox">记住密码</div>
              <div class="fr"><a class="login_a" href="javascript:;">找回密码</a></div>
            </div>
            <div class="clear"></div>
            <div class="form_item">
              <input type="submit" name="" value="登录">
            </div>
          </div>
          <div v-show="cur==1" class="Cbody_item">
            <div class="form_item"><input type="text" name="fname" placeholder="手机号"></div>
            <div class="form_item"><input type="password" name="fpassword" placeholder="验证码"></div>
            <div class="form_item">
              <!-- <div class="fl"><input type="checkbox">记住密码</div>
              <div class="fr"><a href="javascript:;">找回密码</a></div> -->
            </div>
            <div class="clear"></div>
            <div class="form_item">
              <input type="submit" name="" value="登录">
            </div>

          </div>
          <div v-show="cur==2" class="Cbody_item">
            <div class="qcode"><img src="@/assets/static/img/qcode.png" width="160" height="160" alt="二维码" /></div>
            <div class="beizhu">打开手机客户端扫码注册</div>
          </div>
        </div>
      </div>
            <div class="loginrslider fl"><img src="@/assets/static/img/dbg.png"></div>
    </div>

  </div></div>


</template>


<script>

// export default {
//   name:"index",
//   data() {
//
//     return {
//       cur: 0
//     }
//   }
//
// }
export default {
  name: "index",
  data() {
    return{
      cur: 0

    }
    /*

    return
    {
      cur: 0

    }
    如果你的return 这么写的话，后面加了换行就代表着结束，
    因为js语言不是强类型语言，
    不用加；都行的，以换行为标志代表着一串代码的结束

    */
  }
};
</script>



<style rel="stylesheet/scss" lang="scss" scoped >
@import "../../assets/static/css/main.css";
.login-container {
  z-index: 3;
  position: fixed;
  height: 100%;
  width: 100%;
  pointer-events: none;

}
.login-form
{
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 3;
  background-color: rgba(26, 17, 3, 0);
}
</style>
